﻿@model WebSoftSeo.Models.Consult
@{
    ViewBag.Title = "Tư Vấn";
}

<div class="wrapfilterbgBlog">
    <div class="container">
        <div class="wrapfilter1">
            <div class="divfilterL">
                <h4 class="h1title">Tư vấn</h4>
            </div>
            <div class="clearfix"></div>
        </div>
    </div>
</div>
<!-- Content Blog -->
<div class="wrapBlogContent">
    <div class="container">
        <!-- blogContentL -->
        <div class="blogContentL">
            <ul class="listCons">
                <li>
                    @Html.Partial("ContentConsult")
                </li>
            </ul>
        </div>
        
        <!-- End blogContentL -->
        <!-- blogContentR -->
        <div class="blogContentR">
           @using (Html.BeginForm("FormCreate", "Consult", FormMethod.Post, new { enctype = "multipart/form-data", id = "ConsultForm" }))
             {
                <p class="h1Sibar">Đặt câu hỏi</p>
                <ul class="listForm">
                    <li>
                        <label>Họ tên</label>
                        @Html.TextBoxFor(m => m.Name, new { @id = "NameConsult", @placeholder = "Name", @class = "textbox" })
                        <p id="NameConsult1" class="required"></p>
                        <div class="clearfix"></div>
                    </li>
                    <li>
                        <label>Email</label>
                            @Html.TextBoxFor(m => m.Email, new { id = "EmailConsult", @placeholder = "Email", @class = "textbox" })
                            <p class="required" ; id="EmailConsult1"></p>
                        <div class="clearfix"></div>
                    </li>
                    <li>
                        <label>Tiêu đề</label>
                            @Html.TextBoxFor(m => m.Title, new { id = "TitleConsult", @placeholder = "Tiêu đề", @class = "textbox" })
                            <p class="required" ; id="TitleConsult1"></p>
                        <div class="clearfix"></div>
                    </li>
                    <li>
                        <label>Điện thoại</label>
                            @Html.TextBoxFor(m => m.Phone, new { id = "PhoneConsult", @placeholder = "Điện thoại", @class = "textbox" })
                            <p class="required" ; id="PhoneConsult1"></p>
                        <div class="clearfix"></div>
                    </li>
                    <li>
                        <label>Nội dung</label>
                            @Html.TextAreaFor(m => m.Contents, new { id = "Content", @placeholder = "Nội dung", @class = "textarea" })
                            <p class="required" ; id="Content1"></p>
                        <div class="clearfix"></div>
                    </li>
                </ul>
                <div class="btnSupport">
                    <button type="submit" class="button">Gửi</button>
                </div>
             }
            <div class="clearfix"></div>
            <p class="h1Sibar">Hỗ trợ</p>
            <div class="divSupport">
                     @Html.Partial("_Support")
            </div>
        </div>
        <!-- End blogContentR -->
        <div class="clearfix"></div>
    </div>
</div>
<!-- End Content Blog -->

<script type="text/javascript">

    function ValidateContact() {
        var NameConsult = $("#NameConsult").val();
        var EmailConsult = $("#EmailConsult").val();
        var TitleConsult = $("#TitleConsult").val();
        var PhoneConsult = $("#PhoneConsult").val();
        var Content = $("#Content").val();
        if (NameConsult == "" || EmailConsult == "" || TitleConsult == "" || PhoneConsult == ""||Content=="") {
            if (NameConsult == "") {
                $("#NameConsult1").html("Vui lòng nhập tên");
                $("#NameConsult").addClass("validation-failed");
                $("#NameConsult").focus();

            }
            if (EmailConsult == "") {
                $("#EmailConsult1").html("Vui lòng nhập Email");
                $("#EmailConsult").addClass("validation-failed");
                $("#EmailConsult").focus();

            }
            if (TitleConsult == "") {
                $("#TitleConsult1").html("Vui lòng nhập tiêu đề");
                $("#TitleConsult").addClass("validation-failed");
                $("#TitleConsult").focus();
            }
            if (PhoneConsult == "") {
                $("#PhoneConsult1").html("Vui lòng nhập số điện thoại");
                $("#PhoneConsult").addClass("validation-failed");
                $("#PhoneConsult").focus();
            }
            if (Content == "") {
                $("#Content1").html("Vui lòng nhập nội dung");
                $("#Content").addClass("validation-failed");
                $("#Content").focus();
            }
            return false;
        }
        if (!isValidEmailAddress(EmailConsult)) {
            $("#EmailConsult1").html("Email không hợp lệ");
            $("#EmailConsult").addClass("validation-failed");
            $("#EmailConsult").focus();
            return false;
        }
        if (!isValidphone(PhoneConsult)) {
            $("#PhoneConsult1").html("Số điện thoại không hợp lệ");
            $("#PhoneConsult").addClass("validation-failed");
            $("#PhoneConsult").focus();
            return false;
        }
        return true;
    }
</script>
<script type="text/javascript">
    function isValidEmailAddress(EmailConsult) {
        var pattern = new RegExp(/^(("[\w-\s]+")|([\w-]+(?:\.[\w-]+)*)|("[\w-\s]+")([\w-]+(?:\.[\w-]+)*))(@@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/i);
        return pattern.test(EmailConsult);
    }
</script>
<script type="text/javascript">
    function isValidphone(PhoneConsult) {
        var pattern = new RegExp(/^(([0-9]{3})\)?[-., ]?([0-9]{3})[-., ]?([0-9]{4})?$)/i);
        return pattern.test(PhoneConsult);
    }
</script>
<script type="text/javascript">
    $("#NameConsult").blur(function () {
        var name = $('#NameConsult').val();
        if (name != "") {
            document.getElementById("NameConsult1").innerHTML = "";
            $("#NameConsult").removeClass("validation-failed")
        }
    });
</script>
<script type="text/javascript">
    $("#EmailConsult").blur(function () {
        var name = $('#EmailConsult').val();
        if (name != "") {
            document.getElementById("EmailConsult1").innerHTML = "";
            $("#EmailConsult").removeClass("validation-failed")
        }
    });
</script>
<script type="text/javascript">
    $("#TitleConsult").blur(function () {
        var name = $('#TitleConsult').val();
        if (name != "") {
            document.getElementById("TitleConsult1").innerHTML = "";
            $("#TitleConsult").removeClass("validation-failed")
        }
    });
</script>
<script type="text/javascript">
    $("#PhoneConsult").blur(function () {
        var name = $('#PhoneConsult').val();
        if (name != "") {
            document.getElementById("PhoneConsult1").innerHTML = "";
            $("#PhoneConsult").removeClass("validation-failed")
        }
    });
</script>
<script type="text/javascript">
    $("#Content").blur(function () {
        var name = $('#Content').val();
        if (name != "") {
            document.getElementById("Content1").innerHTML = "";
            $("#Content").removeClass("validation-failed")
        }
    });
</script>
<script type="text/javascript">
    $('#ConsultForm').submit(function () {

        return ValidateContact();

    });
</script>
